// 学部/单位人才图表
function initUnitTalent() {
  const colleges = [
    "材料与土建资",
    "交通与船海工",
    "机电与车辆工",
    "信息学部",
    "理学部",
    "人文与社会科",
    "经济管理学部",
  ];
  const data1 = [88, 25, 75, 23, 23, 23, 23];
  const data2 = [251, 112, 35, 84, 23, 23, 23];
  const data3 = [99, 38, 33, 29, 23, 23, 23];

  const myChart = echarts.init(document.getElementById("unit-talent"));

  const option = {
    tooltip: {
      trigger: "axis",
      axisPointer: { type: "shadow" },
      backgroundColor: "rgba(10, 25, 48, 0.8)",
      borderColor: "#2a7bc2",
      textStyle: {
        color: "#fff",
      },
    },
    legend: {
      show: false,
    },
    grid: {
      left: 100,
      right: 60,
      top: 10,
      bottom: 10,
    },
    xAxis: {
      type: "value",
      axisLabel: { formatter: "{value}" },
      axisLine: { show: false },
      axisTick: { show: false },
      splitLine: { lineStyle: { color: "rgba(126, 155, 189, 0.2)" } },
    },
    yAxis: {
      type: "category",
      data: colleges,
      axisLine: { show: false },
      axisTick: { show: false },
      axisLabel: {
        color: "#fff", // ← 左侧文字白色
      },
    },
    series: [
      {
        name: "数据1",
        type: "bar",
        stack: "total",
        label: { show: true, position: "inside", formatter: "{c}" },
        emphasis: { focus: "series" },
        data: data1,
        itemStyle: { color: "#5470c6" },
      },
      {
        name: "数据2",
        type: "bar",
        stack: "total",
        label: { show: true, position: "inside", formatter: "{c}" },
        emphasis: { focus: "series" },
        data: data2,
        itemStyle: { color: "#91cc75" },
      },
      {
        name: "数据3",
        type: "bar",
        stack: "total",
        label: {
          show: true,
          position: "inside", // ← 挪到柱子内部
          formatter: "{c}",
        },
        emphasis: { focus: "series" },
        data: data3,
        itemStyle: { color: "#fac858" },
      },
    ],
  };

  myChart.setOption(option);

  window.addEventListener("resize", () => myChart.resize());
}

// 年度入选图表
function initYearTalent() {
  // 初始化ECharts实例
  const chartDom = document.getElementById("year-talent");
  const myChart = echarts.init(chartDom);

  // 图表配置项
  const option = {
    title: {
      text: "",
      left: "center",
      textStyle: {
        color: "#fff",
        fontSize: 18,
        fontWeight: "bold",
      },
    },
    tooltip: {
      trigger: "axis",
      axisPointer: {
        type: "shadow",
      },
      formatter: "{b}: {c}",
      backgroundColor: "rgba(10, 25, 48, 0.8)",
      borderColor: "#2a7bc2",
      textStyle: {
        color: "#fff",
      },
    },
    grid: {
      left: "3%",
      right: "4%",
      bottom: "10%",
      top: "15%",
      containLabel: true,
    },
    xAxis: {
      type: "category",
      data: ["武大", "华科", "武理", "华农", "地大", "华师", "财大"],
      axisLine: {
        lineStyle: {
          color: "#7e9bbd",
          width: 2,
        },
      },
      axisLabel: {
        color: "#fff",
        fontSize: 14,
        fontWeight: "bold",
      },
      axisTick: {
        alignWithLabel: true,
        lineStyle: {
          color: "#7e9bbd",
        },
      },
    },
    yAxis: {
      type: "value",
      min: 0,
      max: 100,
      interval: 20,
      axisLine: {
        show: true,
        lineStyle: {
          color: "#7e9bbd",
          width: 2,
        },
      },
      axisLabel: {
        color: "#fff",
        fontSize: 12,
        formatter: "{value}",
      },
      splitLine: {
        lineStyle: {
          color: "rgba(126, 155, 189, 0.2)",
          type: "dashed",
        },
      },
      nameTextStyle: {
        color: "#fff",
        fontSize: 12,
        padding: [0, 0, 0, -40],
      },
    },
    series: [
      {
        name: "平均月薪",
        type: "bar",
        data: [
          { value: 89, itemStyle: { color: "#5ab1ef" } },
          { value: 92, itemStyle: { color: "#5ab1ef" } },
          { value: 23, itemStyle: { color: "#5ab1ef" } },
          { value: 20, itemStyle: { color: "#5ab1ef" } },
          { value: 19, itemStyle: { color: "#5ab1ef" } },
          { value: 14, itemStyle: { color: "#5ab1ef" } },
          { value: 6, itemStyle: { color: "#5ab1ef" } },
        ],
        barWidth: "45%",
        label: {
          show: true,
          position: "top",
          color: "#fff",
          fontSize: 14,
          fontWeight: "bold",
          formatter: "{c}",
        },
        itemStyle: {
          color: new echarts.graphic.LinearGradient(
            0,
            0,
            0,
            1, // 纵向渐变（从上到下）
            [
              { offset: 0, color: "#13D2FF" },
              { offset: 1, color: "#00A0E9" },
            ]
          ),
          borderRadius: [4, 4, 0, 0], // 顶部圆角
        },
        emphasis: {
          itemStyle: {
            shadowColor: "rgba(0, 150, 255, 0.8)",
            shadowBlur: 12,
            shadowOffsetY: 4,
          },
        },
      },
    ],
  };

  // 应用配置项
  myChart.setOption(option);

  // 响应窗口大小变化
  window.addEventListener("resize", function () {
    myChart.resize();
  });
}

// 博士后进站人数图表
function initBsTalent() {
  // 初始化ECharts实例
  const chartDom = document.getElementById("last-chart");
  const myChart = echarts.init(chartDom);

  const option = {
    tooltip: {
      trigger: "axis",
      axisPointer: { type: "shadow" },
      backgroundColor: "rgba(10, 25, 48, 0.8)",
      borderColor: "#2a7bc2",
      textStyle: {
        color: "#fff",
      },
    },
    grid: {
      left: "3%",
      right: "6%",
      bottom: "5%",
      top: "15%",
      containLabel: true,
    },
    xAxis: {
      type: "category",
      boundaryGap: false,
      axisLabel: {
        color: "#fff",
      },
      axisLine: {
        lineStyle: {
          color: "rgba(255,255,255,0.3)", // 坐标轴线条颜色
        },
      },
      splitLine: { lineStyle: { color: "rgba(255, 255, 255, 0.3)" } },
      data: ["2020", "2021", "2022", "2023", "2024", "2025"],
    },
    yAxis: {
      type: "value",
      name: "人数",
      axisLine: { show: true },
      axisTick: { show: true },
      splitLine: {
        lineStyle: {
          color: "rgba(255, 255, 255, 0.3)", // 横线（网格线）颜色修改
        },
      },
      axisLabel: {
        color: "#fff",
      },
      nameTextStyle: {
        color: "#fff",
      },
    },
    series: [
      {
        name: "人数",
        type: "line",
        smooth: true,
        symbol: "circle",
        symbolSize: 10,
        itemStyle: {
          color: "#ffffff", // 白心
          borderColor: "#409eff", // 描边
          borderWidth: 3,
        },
        lineStyle: { color: "#409eff", width: 3 },
        areaStyle: {
          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
            { offset: 0, color: "rgba(64, 158, 255, 0.4)" },
            { offset: 1, color: "rgba(64, 158, 255, 0.1)" },
          ]),
        },
        data: [16, 67, 107, 120, 121, 140],
      },
    ],
  };

  myChart.setOption(option);

  // 响应窗口大小变化
  window.addEventListener("resize", function () {
    myChart.resize();
  });
}

// 人才年龄分布图表
function initAgeTalent() {
  // 初始化ECharts实例
  const chartDom = document.getElementById("one-chart");
  const myChart = echarts.init(chartDom);

  const option = {
    tooltip: {
      trigger: "axis",
      axisPointer: { type: "shadow" },
      backgroundColor: "rgba(10, 25, 48, 0.8)",
      borderColor: "#2a7bc2",
      textStyle: {
        color: "#fff",
      },
    },
    grid: {
      left: "3%",
      right: "4%",
      bottom: "5%",
      top: "15%",
      containLabel: true,
    },
    xAxis: {
      type: "category",
      data: ["30岁以下", "31-40岁", "41-50岁", "51-60岁", "60岁以上"],
      axisLabel: {
        color: "#fff", // 坐标轴文字颜色
      },
      axisLine: {
        lineStyle: {
          color: "rgba(255,255,255,0.3)", // 坐标轴线条颜色
        },
      },
    },
    yAxis: {
      type: "value",
      name: "人数",
      nameTextStyle: {
        color: "#fff",
      },
      axisLabel: {
        color: "#fff",
      },
      axisLine: {
        lineStyle: {
          color: "rgba(255,255,255,0.3)",
        },
      },
      splitLine: {
        lineStyle: {
          color: "rgba(255,255,255,0.1)", // 网格线颜色
        },
      },
    },
    series: [
      {
        type: "bar",
        data: [2, 64, 53, 21, 27],
        itemStyle: {
          color: new echarts.graphic.LinearGradient(
            0,
            0,
            0,
            1, // 纵向渐变（从上到下）
            [
              { offset: 0, color: "rgba(72, 149, 239, 0.8)" },
              { offset: 1, color: "rgba(72, 149, 239, 0.2)" },
            ]
          ),
        },
        label: {
          show: true,
          position: "top",
          color: "#fff",
          fontSize: 14,
        },
        barWidth: "40%", // 柱形宽度
      },
    ],
  };

  myChart.setOption(option);

  // 响应窗口大小变化
  window.addEventListener("resize", function () {
    myChart.resize();
  });
}

// 人才增长趋势图表
function initIncreaseTalent() {
  // x轴数据
  const xData = ["2020", "2021", "2022", "2023", "2024", "2025"];

  // y轴数据
  const yData = [16, 67, 107, 120, 121, 140];

  // 初始化ECharts实例
  const chartDom = document.getElementById("increase-talent");
  const myChart = echarts.init(chartDom);

  // 图表配置项
  const option = {
    tooltip: {
      trigger: "axis",
      axisPointer: { type: "shadow" },
      backgroundColor: "rgba(10, 25, 48, 0.8)",
      borderColor: "#2a7bc2",
      textStyle: {
        color: "#fff",
      },
    },
    grid: {
      left: "3%",
      right: "4%",
      bottom: "5%",
      top: "15%",
      containLabel: true,
    },
    xAxis: {
      type: "category",
      data: xData,
      axisLabel: {
        color: "#fff", // 坐标轴文字颜色
      },
      axisLine: {
        lineStyle: {
          color: "rgba(255,255,255,0.3)", // 坐标轴线条颜色
        },
      },
    },
    yAxis: {
      type: "value",
      name: "人数",
      nameTextStyle: {
        color: "#fff",
      },
      axisLabel: {
        color: "#fff",
      },
      axisLine: {
        lineStyle: {
          color: "rgba(255,255,255,0.3)",
        },
      },
      splitLine: {
        lineStyle: {
          color: "rgba(255,255,255,0.1)", // 网格线颜色
        },
      },
    },
    series: [
      {
        type: "bar",
        data: yData,
        itemStyle: {
          color: new echarts.graphic.LinearGradient(
            0,
            0,
            0,
            1, // 纵向渐变（从上到下）
            [
              { offset: 0, color: "#13D2FF" },
              { offset: 1, color: "#00A0E9" },
            ]
          ),
          borderRadius: [4, 4, 0, 0], // 顶部圆角
        },
        label: {
          show: true,
          position: "top",
          color: "#fff",
          fontSize: 14,
        },
        barWidth: "40%", // 柱形宽度
      },
    ],
  };

  // 应用配置项
  myChart.setOption(option);

  // 响应窗口大小变化
  window.addEventListener("resize", function () {
    myChart.resize();
  });
}

// 专任教师海外经历图表
function initOverseas() {
  const myChart = echarts.init(document.getElementById("overseas"));

  const data = [37.7, 55.36, 58.41, 60.98, 67.68, 68.98];
  const years = ["2020", "2021", "2022", "2023", "2024", "2025"];

  const option = {
    tooltip: {
      trigger: "axis",
      formatter: "{b}: {c}%",
      backgroundColor: "rgba(10, 25, 48, 0.8)",
      borderColor: "#2a7bc2",
      textStyle: {
        color: "#fff",
      },
    },
    grid: {
      left: "3%",
      right: "4%",
      bottom: "5%",
      top: "15%",
      containLabel: true,
    },
    xAxis: {
      type: "category",
      data: years,
      axisLine: { lineStyle: { color: "#fff" } },
      axisLabel: { color: "#fff" },
    },
    yAxis: {
      type: "value",
      name: "百分比",
      axisLabel: {
        formatter: "{value}",
        color: "#fff",
      },
      nameTextStyle: {
        color: "#fff",
      },
      axisLine: { show: false },
      splitLine: { lineStyle: { color: "rgba(126, 155, 189, 0.2)" } },
    },
    series: [
      {
        type: "bar",
        data: data,
        barWidth: "40%",
        itemStyle: {
          borderRadius: [6, 6, 0, 0],
          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
            { offset: 0, color: "#a2d2ff" },
            { offset: 1, color: "#3a86ff" },
          ]),
          shadowColor: "rgba(58, 134, 255, 0.5)",
          shadowBlur: 10,
          shadowOffsetY: 6,
        },
        label: {
          show: true,
          position: "top",
          formatter: "{c}%",
          color: "#fff",
        },
      },
    ],
  };

  myChart.setOption(option);

  // 响应窗口大小变化
  window.addEventListener("resize", function () {
    myChart.resize();
  });
}

function init() {
  initUnitTalent();
  initYearTalent();
  initBsTalent();
  initAgeTalent();
  initIncreaseTalent();
  initOverseas();
}

init();
